<template>
	<view class="draw-invoice">
		<navBar :title="toTypes?'申请开票':'开具发票'"></navBar>
		<view :style="{ height: `${getSystemInfo.navBarHeight}px` }"></view>
		<view :style="{ height: `calc(100vh - ${getSystemInfo.navBarHeight}px)` }">
			<u-alert type="warning" font-size="28rpx" :description="pageTips">
			</u-alert>
			<view class="di-body">
				<u--form ref="formRef" label-width="80px" error-type="toast" :model="formData"
					:label-style="{ fontSize: '28rpx', color: '#646464', whiteSpace: 'nowrap' }">
					<view class="form-block" style="margin: 0">
						<view class="form-block-bg">
							<!-- 发票类型 -->
							<u-form-item label="发票类型">
								<view class="tag-radio">
									<view class="tr-item" v-for="(item, index) in types" :key="index">
										<u-tag plain :text="item.name" :name="item.value"
											:border-color="!item.checked && '#646464'"
											:color="!item.checked && '#646464'"
											@click="isAdd && onCheckType(item.value)">
										</u-tag>
									</view>
								</view>
							</u-form-item>

							<!-- 抬头类型 -->
							<u-form-item label="抬头类型">
								<view class="tag-radio">
									<view class="tr-item" v-for="(item, index) in headerTypes" :key="index">
										<u-tag plain :text="item.name" :name="item.value"
											:border-color="!item.checked && '#646464'"
											:color="!item.checked && '#646464'"
											@click="isAdd && onCheckHeaderType(item.value)">
										</u-tag>
									</view>
								</view>
							</u-form-item>

							<!-- 发票内容 -->
							<u-form-item label="发票内容">
								<view class="tag-radio">
									<view class="tr-item">
										<u-tag plain text="商品明细" :name="1"></u-tag>
									</view>
								</view>
							</u-form-item>

							<!-- 抬头名称 -->
							<u-form-item label="抬头名称" prop="titleName" required>
								<view class="select-input">
									<u--input v-model="formData.titleName" border="bottom" placeholder="必填"
										@change="setHeaderTypeName"></u--input>
									<view class="icon-arrow" @click="onSelectHeader">
										<u-icon name="arrow-right"></u-icon>
									</view>
								</view>
							</u-form-item>

							<!-- 仅电子普通发票且发票为单位抬头 -->
							<template v-if="!isVAT && isCompanyHeader">
								<!-- 单位税号 -->
								<u-form-item label="单位税号" prop="taxNo" required>
									<u--input v-model="formData.taxNo" border="bottom" placeholder="必填"></u--input>
								</u-form-item>
								<u-form-item label="更多信息">
									<view class="select-input" @click="toMoreInfo">
										<u--textarea readonly border="bottom" placeholder="填写备注、地址等(非必填)"
											autoHeight></u--textarea>
										<view class="icon-arrow">
											<u-icon name="arrow-right"></u-icon>
										</view>
									</view>
								</u-form-item>
							</template>
						</view>
						<view class="form-block-bg form-item-pic" v-if="isVAT" style="margin: 20rpx 0 0;">
							<!-- 一般纳税人证明 -->
							<u-form-item label="一般纳税人证明" prop="taxpayerCertificateImg" required>
								<view class="pic-content">
									<!-- <image
										v-if="!formData.nashui"
										class="upload-pic"
										src="https://coach-vehicle-uat-1313990257.cos.ap-beijing.myqcloud.com/miniapp/mine/invoice_pic.png"
										mode=""
									></image>
									<image
										v-else
										class="upload-pic"
										src="formData.nashui"
										mode=""
									></image> -->
									<uploadImg :width="80" :height="70"
										@deleteImg="formData.taxpayerCertificateImg = ''"
										@handleImg="(url) => formData.taxpayerCertificateImg = url"
										:previewUrl="[formData.taxpayerCertificateImg]" />
									<text style="color:#CF1A1B;margin-right:20rpx;" @click="onPreview(1)">照片示例</text>
								</view>
							</u-form-item>
							<!-- 单位营业执照 -->
							<u-form-item label="单位营业执照" prop="businessLicenseImg" required>
								<view class="pic-content">
									<uploadImg :width="80" :height="70" @deleteImg="formData.businessLicenseImg = ''"
										@handleImg="(url) => formData.businessLicenseImg = url"
										:previewUrl="[formData.businessLicenseImg]" />
									<text style="color:#CF1A1B;margin-right:20rpx;" @click="onPreview(2)">照片示例</text>
								</view>
							</u-form-item>
							<!-- 物流公司委托司机购买轮胎的委托书 -->
							<u-form-item label="物流公司委托司机购买轮胎的委托书" prop="powerAttorneyImg" required>
								<view class="pic-content">

									<uploadImg :width="80" :height="70" @deleteImg="formData.powerAttorneyImg = ''"
										@handleImg="(url) => formData.powerAttorneyImg = url"
										:previewUrl="[formData.powerAttorneyImg]" />
									<text style="color:#CF1A1B;margin-right:20rpx;" @click="onPreview(3)">照片示例</text>
								</view>
							</u-form-item>
						</view>

						<view class="form-block-bg" v-if="isVAT" style="margin: 20rpx 0 0;">
							<view class="title">法人身份证</view>
							<uploadSFZ @handleURL="handleURL" @handleDelURl="handleDelURl"
								:bossBackImgUrl="formData.bossBackImg" :bossJustImgUrl="formData.bossJustImg" />
						</view>

						<view class="form-block-bg" v-if="isVAT" style="margin: 20rpx 0 0;">
							<!-- 单位税号 -->
							<u-form-item label="单位税号" prop="taxNo" required>
								<u--input v-model="formData.taxNo" border="bottom" placeholder="必填"></u--input>
							</u-form-item>

							<!-- 注册地址 -->
							<u-form-item label="注册地址" prop="address" required>
								<u--input v-model="formData.address" border="bottom" placeholder="必填"></u--input>
							</u-form-item>

							<!-- 注册电话 -->
							<u-form-item label="注册电话" prop="telephone" required>
								<u--input v-model="formData.telephone" border="bottom" placeholder="必填"></u--input>
							</u-form-item>

							<!-- 开户银行 -->
							<u-form-item label="开户银行" prop="bankName" required>
								<u--input v-model="formData.bankName" border="bottom" placeholder="必填"></u--input>
							</u-form-item>

							<!-- 银行账号 -->
							<u-form-item label="银行账号" prop="bankNo" required>
								<u--input v-model="formData.bankNo" border="bottom" placeholder="必填"></u--input>
							</u-form-item>
						</view>

					</view>

					<!-- 增值税填写收票信息 -->
					<view class="form-block">
						<view class="form-block-bg">
							<view class="title">接收方式</view>
							<template v-if="isVAT">
								<!-- 收票人 -->
								<u-form-item label="收票人" prop="receiptPerson" required>
									<u--input v-model="formData.receiptPerson" border="bottom"
										placeholder="请输入收票人姓名"></u--input>
								</u-form-item>

								<!-- 联系电话 -->
								<u-form-item label="联系电话" prop="receiptTel" required>
									<u--input v-model="formData.receiptTel" border="bottom"
										placeholder="请输入联系电话"></u--input>
								</u-form-item>

								<!-- 所在地区 -->
								<u-form-item label="所在地区" prop="receiptCounty" required>
									<picker mode="region" @change="onChangeArea">
										<view class="select-input">
											<u--input :value="areaText" placeholder="请选择所在地区" border="bottom"
												readonly></u--input>
											<view class="icon-arrow">
												<u-icon name="arrow-right"></u-icon>
											</view>
										</view>
									</picker>
								</u-form-item>

								<!-- 详细地址 -->
								<u-form-item label="详细地址" prop="receiptAddressDetail" required>
									<u--input v-model="formData.receiptAddressDetail" border="bottom"
										placeholder="请输入详细地址"></u--input>
								</u-form-item>
							</template>
							<template v-else>
								<!-- 电子邮箱 -->
								<u-form-item label="电子邮箱" prop="email" required>
									<u--input v-model="formData.email" border="bottom" placeholder="必填"></u--input>
								</u-form-item>

								<!-- 手机号码 -->
								<u-form-item label="手机号码" prop="phone">
									<u--input v-model="formData.phone" border="bottom" placeholder="选填"></u--input>
								</u-form-item>
							</template>
						</view>

					</view>

				</u--form>
			</view>

			<view class="di-button">
				<u-button type="primary" text="不开发票" plain @click="onUndrawing" v-if="!toTypes"></u-button>
				<u-button type="primary" text="提交" @click="onClickSubmit"></u-button>
			</view>
		</view>

		<!-- 弹窗：确认开票信息 -->
		<u-modal :show="visibleInvoice" title="确认开票信息" :showCancelButton="true" cancelText="返回修改" confirmText="确认提交"
			confirmColor="#CF1A1B" @confirm="onConfirm" @cancel="visibleInvoice = false">
			<view class="confirm-content">
				<view>
					<u--text size="28rpx" color="#333" :lines="1" :text="`抬头名称：${formData.titleName}`">
					</u--text>
				</view>
				<view>
					<u--text size="28rpx" color="#333" :lines="1" :text="`单位税号：${formData.taxNo}`">
					</u--text>
				</view>
				<view>
					<text>开票金额：¥{{ formatMoney(invoiceAmount) }}</text>
				</view>
			</view>
		</u-modal>
		<u-modal :show="visibleEdit" content="请先修改增值税专用发票抬头,补充图片信息再次提交？" title="温馨提示" :showCancelButton="true"
			cancelText="再等等" confirmText="去完善" confirmColor="#CF1A1B" @confirm="confirmEdit"
			@cancel="visibleEdit = false">
		</u-modal>

		<u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
	import {
		mapState,
		mapGetters,
		mapMutations
	} from 'vuex'
	import navBar from '@/components/navBar.vue'
	import uploadImg from '@/components/uploadImg.vue'
	import uploadSFZ from '@/components/uploadSFZ.vue'
	import {
		formatMoney
	} from '@/common/utils'

	const defaultFormData = {
		orderIds: [], // 开票订单id列表
		invoiceType: 0, // 发票类型；0-电子普通发票，1-增值税专用发票
		titleType: 0, // 抬头类型；0-单位，1-个人/非企业单位
		invoiceContent: 1, // 发票内容 1-商品明细
		titleName: '', // 抬头名称
		nashui: '', // 一般纳税人证明
		taxNo: '', // 税号
		address: '', // 地址
		telephone: '', // 电话,
		bankName: '', // 开户银行
		bankNo: '', // 银行账号
		receiptPerson: '', // 收票人
		receiptTel: '', // 收票人联系电话
		receiptProvince: '', // 收票-省
		receiptCity: '', // 收票-市
		receiptCounty: '', // 收票-区
		receiptAddressDetail: '', // 收票人详细地址
		email: '', // 电子邮箱
		phone: undefined, // 手机号码
		businessLicenseImg: '', //营业执照照片
		bossBackImg: '', //身份证照片反面
		bossJustImg: '', //身份证照片正面
		taxpayerCertificateImg: '', //纳税人证明照片
		powerAttorneyImg: '' //委托书照片
	}

	export default {
		components: {
			navBar,
			uploadImg,
			uploadSFZ
		},
		data() {
			return {
				// 发票类型
				types: [{
						name: '电子普通发票',
						value: 0,
						checked: true
					},
					{
						name: '增值税专用发票',
						value: 1,
						checked: false
					},
				],
				// 抬头类型
				headerTypes: [{
						name: '单位',
						value: 0,
						checked: true
					},
					{
						name: '个人/非企业单位',
						value: 1,
						checked: false
					},
				],

				// 提交数据
				formData: {
					...defaultFormData
				},
				//
				invoiceInitInfo1: {
					...defaultFormData
				},
				invoiceInitInfo2: {
					...defaultFormData
				},
				// 校验规则
				rules: {
					businessLicenseImg: [{
						required: true,
						message: '请上传营业执照照片'
					}],
					bossBackImg: [{
						required: true,
						message: '请上传身份证照片反面'
					}],
					bossJustImg: [{
						required: true,
						message: '请上传身份证照片正面'
					}],
					taxpayerCertificateImg: [{
						required: true,
						message: '请上传纳税人证明照片'
					}],
					powerAttorneyImg: [{
						required: true,
						message: '请上传委托书照片'
					}],
					titleName: [{
						required: true,
						message: '请输入抬头名称'
					}],
					nashui: [{
						required: true,
						message: '请上传一般纳税人证明'
					}],
					taxNo: [{
						required: true,
						message: '请输入单位税号'
					}],
					address: [{
						required: true,
						message: '请输入注册地址'
					}],
					telephone: [{
							required: true,
							message: '请输入注册电话'
						},
						{
							// pattern: /0\d{2,3}-\d{7,8}/g,
							pattern: /^\d(\d|-)+\d$/g,
							message: '注册电话格式不正确'
						}
					],
					bankName: [{
						required: true,
						message: '请输入开户银行'
					}],
					bankNo: [{
						required: true,
						message: '请输入银行账号'
					}],
					receiptPerson: [{
						required: true,
						message: '请输入收票人'
					}],
					receiptTel: [{
						required: true,
						message: '请输入联系电话'
					}],
					receiptCounty: [{
						required: true,
						message: '请选择所在地区'
					}],
					receiptAddressDetail: [{
						required: true,
						message: '请输入详细地址'
					}],
					email: [{
							required: true,
							message: '请输入电子邮箱'
						},
						{
							type: 'email',
							message: '电子邮箱不正确',
							trigger: ['change', 'blur'],
						}
					],
					phone: [{
						validator: (rule, value, callback) => {
							return !!value ? uni.$u.test.mobile(value) : true
						},
						message: '手机号码不正确',
						trigger: ['change', 'blur'],
					}]
				},

				// 开票金额
				invoiceAmount: '',

				// 确认开票信息弹窗
				visibleInvoice: false,
				visibleEdit: false,
				currentId: '',
				currHeaderType1: '',
				currHeaderType2: '',
				toTypes:true
			}
		},
		computed: {
			...mapGetters('global', ['getSystemInfo']),
			...mapState('user', ['userInfo']),

			// 是否增值税发票
			isVAT() {
				return this.types[1].checked
			},
			// 是否公司抬头
			isCompanyHeader() {
				return this.headerTypes[0].checked
			},
			// 是否有个人类型抬头选项
			hasPersonType() {
				return this.headerTypes.some(item => item.name === '个人/非企业单位')
			},
			// 区域文本显示
			areaText() {
				const {
					receiptProvince,
					receiptCity,
					receiptCounty
				} = this.formData
				if (receiptProvince) {
					return `${receiptProvince} ${receiptCity} ${receiptCounty}`
				}
				return ''
			},
			// 是否新增
			isAdd() {
				return !this.formData.id
			},
			// 页头提示
			pageTips() {
				const orders = this.formData.orderIds
				const orderTips = orders && (orders.length > 0) ? `已选${orders.length}个订单，` : ''
				return `${orderTips}预计发票金额共：¥${this.formatMoney(this.invoiceAmount)}
        预计金额仅作为参考，请以开发票的实际金额为准`
			},
			// 是否已有订单开票，
			// 开发票入口均为true，确认订单入口为false
			isOrderInvoicing() {
				return this.formData.orderIds && this.formData.orderIds.length > 0
			}
		},
		methods: {
			handleDelURl(type) {
				if (type === 'zheng') {
					this.formData.bossJustImg = ''
				} else {
					this.formData.bossBackImg = ''
				}
			},
			handleURL({
				type,
				url
			}) {
				if (type === 'zheng') {
					this.formData.bossJustImg = url
				} else {
					this.formData.bossBackImg = url
				}
			},
			async resetInvoice() {
				const invoice = await this.getLastSaveInfo()
				if (invoice && invoice.titleName) {
					const params = {
						invoiceType: invoice.invoiceType,
						titleType: invoice.titleType,
						titleName: invoice.titleName || '',
						taxNo: invoice.taxNo || '',
						remarks: invoice.remarks || '',
						email: invoice.email || '',
						phone: invoice.phone || '',
						address: invoice.address || '',
						telephone: invoice.telephone || '',
						bankName: invoice.bankName || '',
						bankNo: invoice.bankNo || '',
						receiptPerson: invoice.receiptPerson || '',
						receiptTel: invoice.receiptTel || '',
						receiptProvince: invoice.receiptProvince || '',
						receiptCity: invoice.receiptCity || '',
						receiptCounty: invoice.receiptCounty || '',
						receiptAddressDetail: invoice.receiptAddressDetail || '',
						businessLicenseImg: invoice.businessLicenseImg || '',
						bossBackImg: invoice.bossBackImg || '',
						bossJustImg: invoice.bossJustImg || '',
						taxpayerCertificateImg: invoice.taxpayerCertificateImg || '',
						powerAttorneyImg: invoice.powerAttorneyImg || '',
					}
					this.setInvoiceInfo(params)
				}
			},
			//增值税发票信息不全，去新增
			confirmEdit() {
				uni.navigateTo({
					url: '/minePack/function/invoice/addInvoiceHeader?perfectInfo=1&id=' + this.currentId,
					events: {
						update: this.resetInvoice
					},
					success: (res) => {
						res.eventChannel.emit('edit', this.currentId)
					}
				})
			},
			// 获取上一次填写的信息回显
			async getLastSaveInfo() {
				const res = await this.$request({
					method: 'GET',
					url: '/order-center/invoice/desc/last',
				})
				const res1 = await this.$request({
					method: 'GET',
					url: '/order-center/invoice/title/default',
				})
				const way = await this.$request({
					method: 'GET',
					data: {
						invoiceType: 0
					},
					url: '/order-center/invoice/desc/last',
				})
				if (res1.datas) {
					res1.datas.email = res1.datas.email ? res1.datas.email : way.datas.email
					res1.datas.phone = res1.datas.phone ? res1.datas.phone : way.datas.phone
					return res1.datas
				} else if (res.datas) {
					res.datas.email = res.datas.email ? res.datas.email : way.datas.email
					res.datas.phone = res.datas.phone ? res.datas.phone : way.datas.phone
					return res.datas
				}

			},
			// 提交
			async onConfirm() {
				const eventChannel = this.getOpenerEventChannel()

				if (this.isOrderInvoicing) {
					try {
						// 请求参数
						const params = {
							...this.formData
						}
						Object.keys(params).forEach(key => {
							if (params[key] === '') {
								params[key] = undefined
							}
						})
						// loading
						uni.showLoading({
							title: '网络请求中',
							mask: true
						})
						// 请求
						await this.$request({
							url: '/order-center/invoice/invoicing',
							data: params
						})
						// 请求成功
						this.visibleInvoice = false
						uni.hideLoading()
						uni.showToast({
							title: '请求成功',
							icon: 'success',
							mask: true
						})
						setTimeout(() => {
							uni.redirectTo({
								url: '/minePack/function/invoice/submitSuccessfully',
								success: () => {
									setTimeout(() => {
										const invoiceType = this.formData
											.invoiceType
										uni.$emit('drawInvoiceInfo', {
											invoiceType
										})
									}, 300)
								}
							})
						}, 1500)
					} catch (err) {
						uni.hideLoading()
						this.$refs.uToast.show({
							message: err.respMsg || '请求失败',
							position: 'top'
						})
					}
				} else {
					// 确认订单入口进来
					uni.navigateBack({
						success: () => {
							const data = {
								...this.formData
							}
							eventChannel.emit('drawInvoiceInfo', data)
						}
					})
				}
			},

			// 点击提交
			async onClickSubmit() {
				// 格式校验
				await this.$refs.formRef.validate()
				// 确认开票信息
				this.visibleInvoice = true
			},

			// 更多信息
			toMoreInfo() {
				uni.navigateTo({
					url: '/minePack/function/invoice/components/moreInvoiceInfo',
					events: {
						submitMoreInfo: (data) => {
							this.formData = {
								...this.formData,
								...data
							}
						}
					},
					success: (res) => {
						const info = {
							...this.formData
						}
						res.eventChannel.emit('setMoreInvoiceInfo', info)
					}
				})
			},

			// 处理选中的发票抬头
			async setInvoiceInfo(data) {
				if (data.id) {
					this.currentId = data.id
				}
				if ((data.invoiceType == 1 && data.titleName) && (!data.businessLicenseImg || !data
						.taxpayerCertificateImg || !data
						.powerAttorneyImg)) {
					this.visibleEdit = true
				}
				const val = {
					...data
				}
				delete val.id
				delete val.createdTime
				delete val.defaultFlag
				const params = {
					...this.formData,
					...val
				}
				if (data.invoiceType == 1) {
					this.invoiceInitInfo2 = params
					this.invoiceInitInfo1.phone = params.phone ? params.phone : this.invoiceInitInfo1.phone
					this.invoiceInitInfo1.email = params.email ? params.email : this.invoiceInitInfo1.email
				} else {
					if (params.titleType == 0) {
						this.currHeaderType1 = params.titleName
					} else {
						params.taxNo = this.invoiceInitInfo1.taxNo
						this.currHeaderType2 = params.titleName
					}
					this.invoiceInitInfo1 = params
				}


				this.formData = params
				// 设置发票类型选中
				this.checkType(val.invoiceType)
				// 设置抬头类型选中
				this.checkHeaderType(val.titleType)
			},
			setHeaderTypeName() {
				if (this.formData.titleType == 1) {
					this.currHeaderType2 = this.formData.titleName
				}
				if(this.formData.invoiceType == 0 && this.formData.titleType == 0){
					this.currHeaderType1 = this.formData.titleName
				}
			},

			// 选择发票抬头
			onSelectHeader() {
				uni.navigateTo({
					url: '/minePack/function/invoice/components/headerList',
					events: {
						selectInvoiceHeader: this.setInvoiceInfo
					},
					success: (res) => {
						const {
							invoiceType,
							titleType
						} = this.formData
						res.eventChannel.emit('selector', {
							invoiceType,
							titleType
						})
					}
				})
			},

			// 所在地区改变
			onChangeArea(e) {
				const value = e.detail.value || []
				this.formData.receiptProvince = value[0]
				this.formData.receiptCity = value[1]
				this.formData.receiptCounty = value[2]
			},

			// 选择发票类型
			checkType(value) {
				this.types.forEach(item => {
					item.checked = item.value === value
					if (item.value === value) {
						this.formData.invoiceType = item.value
					}
				})
				if (value === this.types[0].value && !this.hasPersonType) {
					// 选择电子普通发票，恢复个人抬头选项
					this.headerTypes.push({
						name: '个人/非企业单位',
						value: 1,
						checked: this.invoiceInitInfo1.titleType == 1
					})
					this.headerTypes[0].checked =  this.invoiceInitInfo1.titleType == 0
					this.formData.titleType = this.invoiceInitInfo1.titleType	
					if(this.invoiceInitInfo1.titleType == 0){
						this.formData.titleName = this.currHeaderType1
					}else{
						this.formData.titleName = this.currHeaderType2
					}

				} else if (value === this.types[1].value) {
					// 选择增值税发票，只显示公司抬头选项
					this.headerTypes = [{
						name: '单位',
						value: 0,
						checked: true
					}]
					this.formData.titleType = 0
				}

				// 设置校验规则规则
				this.setRules()
			},
			onCheckType(value) {
				this.resetForm({
					whiteList: ['orderIds']
				})
				delete this.invoiceInitInfo2.id
				delete this.invoiceInitInfo1.id
				this.invoiceInitInfo2.orderIds = this.formData.orderIds
				this.invoiceInitInfo1.orderIds = this.formData.orderIds
				if (value == 0) {
					this.formData = this.invoiceInitInfo1
				} else {
					this.formData = this.invoiceInitInfo2
				}
				this.checkType(value)
			},

			// 选择抬头类型
			checkHeaderType(value) {
				this.headerTypes.forEach(item => {
					item.checked = item.value === value
					if (item.value === value) {
						this.formData.titleType = item.value
						if (this.formData.invoiceType == 0) {
							if (item.value == 0) {
								this.formData.titleName = this.currHeaderType1
							} else {
								this.formData.titleName = this.currHeaderType2
							}
						}

					}
				})
			},
			onCheckHeaderType(value) {
				this.resetForm({
					whiteList: ['orderIds', 'invoiceType']
				})
				this.checkHeaderType(value)
			},

			// 获取默认发票
			async getDefaultInvoice() {
				const {
					datas
				} = await this.$request({
					url: '/order-center/invoice/title/default',
					method: 'GET'
				})
				if (datas) {
					this.setInvoiceInfo(datas)
				}
			},

			// 重置表单
			resetForm(options = {}) {
				// const whiteList = options.whiteList || [] // 不需要重置的字段
				// Object.keys(this.formData).forEach(key => {
				// 	if (!whiteList.includes(key)) {
				// 		this.formData[key] = defaultFormData[key]
				// 	}
				// })
				// this.$refs.formRef.clearValidate()
			},

			// 不开票
			onUndrawing() {
				const eventChannel = this.getOpenerEventChannel()

				uni.navigateBack({
					success: () => {
						eventChannel.emit('drawInvoiceInfo', {})
					}
				})
			},
			//图片预览
			onPreview(val) {
				var urlList = []
				if (val == 1) {
					urlList = [
						'https://coach-vehicle-uat-1313990257.cos.ap-beijing.myqcloud.com/miniapp/mine/nsrzm_pic1.png',
						'https://coach-vehicle-uat-1313990257.cos.ap-beijing.myqcloud.com/miniapp/mine/nsrzm_pic2.png',
						'https://coach-vehicle-uat-1313990257.cos.ap-beijing.myqcloud.com/miniapp/mine/nsrzm_pic3.png'
					]
				}
				if (val == 2) {
					urlList = [
						'https://coach-vehicle-uat-1313990257.cos.ap-beijing.myqcloud.com/miniapp/mine/yyzz_pic.png'
					]
				}
				if (val == 3) {
					urlList = [
						'https://coach-vehicle-uat-1313990257.cos.ap-beijing.myqcloud.com/miniapp/mine/wts_pic.png'
					]
				}
				uni.previewImage({
					indicator: "number",
					loop: true,
					urls: urlList
				})
			},

			// 设置校验规则
			setRules() {
				const rules = {
					...this.rules
				}
				if (this.isVAT) {
					// 增值税发票
					delete rules.email
				} else {
					// 电子发票
					delete rules.receiptPerson
					delete rules.receiptTel
					delete rules.receiptCounty
					delete rules.receiptAddressDetail
				}
				this.$refs.formRef.setRules(rules)
			},

			formatMoney,
		},
		onReady() {
			this.setRules()
		},
		onLoad(option) {
			const eventChannel = this.getOpenerEventChannel()
			this.toTypes = option.type?true:false
			eventChannel.on('drawInvoice', async (params) => {
				this.formData.orderIds = params.ids || []
				this.invoiceAmount = params.invoiceAmount
				const invoice = await this.getLastSaveInfo()
				if ((invoice.invoiceType == 1 && invoice.titleName) && (!invoice.businessLicenseImg || !invoice
						.taxpayerCertificateImg || !invoice
						.powerAttorneyImg)) {
					this.visibleEdit = true
					this.currentId = invoice.id
				}
				if (invoice && invoice.titleName) {
					const params = {
						invoiceType: invoice.invoiceType,
						titleType: invoice.titleType,
						titleName: invoice.titleName || '',
						taxNo: invoice.taxNo || '',
						remarks: invoice.remarks || '',
						email: invoice.email || '',
						phone: invoice.phone || '',
						address: invoice.address || '',
						telephone: invoice.telephone || '',
						bankName: invoice.bankName || '',
						bankNo: invoice.bankNo || '',
						receiptPerson: invoice.receiptPerson || '',
						receiptTel: invoice.receiptTel || '',
						receiptProvince: invoice.receiptProvince || '',
						receiptCity: invoice.receiptCity || '',
						receiptCounty: invoice.receiptCounty || '',
						receiptAddressDetail: invoice.receiptAddressDetail || '',
						businessLicenseImg: invoice.businessLicenseImg || '',
						bossBackImg: invoice.bossBackImg || '',
						bossJustImg: invoice.bossJustImg || '',
						taxpayerCertificateImg: invoice.taxpayerCertificateImg || '',
						powerAttorneyImg: invoice.powerAttorneyImg || '',
					}
					this.setInvoiceInfo(params)
				} else if (params.invoice) {
					// 回显发票信息
					this.setInvoiceInfo(params.invoice)
				} else {
					// 获取默认发票
					this.getDefaultInvoice()
				}
			})
		}
	}
</script>

<style scoped lang="scss">
	.draw-invoice {

		/deep/ .u-form-item__body {
			padding: 4px 0 !important;
		}

		.di-body {
			height: calc(100% - 32rpx - 40px - 58px - env(safe-area-inset-bottom));
			font-size: 28rpx;
			overflow-y: auto;
		}

		.form-block {
			// background-color: #fff;
			// padding: 32rpx;
			margin: 20rpx 0 0;

			.form-block-bg {
				background-color: #fff;
				padding: 32rpx;

				.title {
					line-height: 1.5;
					margin-bottom: 10rpx;
				}
			}

			.form-item-pic {
				/deep/ .u-form-item {
					padding: 15rpx 0;
					border-bottom: 0.5px solid #dadbde;
				}

				.pic-content {
					display: flex;
					flex-direction: row-reverse;
					align-items: center;

					/deep/ .u-upload__button {
						margin: 0;
					}

					/deep/ .u-upload__wrap__preview {
						margin: 0;
					}

					.upload-pic {
						width: 80rpx;
						height: 70rpx;
					}
				}
			}
		}

		.select-input {
			display: flex;
			flex-direction: row;
			justify-content: space-between;

			.icon-arrow {
				border-bottom: 0.5px solid #dadbde;
				padding-left: 42rpx;
				display: flex;
				align-items: center;
			}
		}

		.tag-radio {
			display: flex;
			flex-direction: row;
			gap: 24rpx;
			padding: 15rpx 0;
			border-bottom: 0.5px solid #dadbde;

			.tr-item {
				width: calc((100% - 24rpx) / 2);
			}

			/deep/ .u-tag {
				justify-content: center;
			}
		}

		.confirm-content {
			font-size: 28rpx;
			line-height: 2;
			flex: 1;
			color: #333;
		}

		.di-button {
			padding: 32rpx 32rpx env(safe-area-inset-bottom);
			background-color: #fff;
			display: flex;
			flex-direction: row;
			gap: 10rpx;
		}

	}
</style>